import * as React from 'react';
import './EditorCamera.scss';
import InputStep from '@/view/editor/components/commonCompents/EditorInputStep/EditorInputStep';
import { EditorModels } from '@/view/editor/ts/EditorModels';

export interface IEditorCameraProps {
  editorScene: EditorModels;
}

export default function EditorCamera(props: IEditorCameraProps) {
  const { position, rotation } = props.editorScene.camera;

  return (
    <div className="editorCamera">
      <div className="title">相机位置</div>
      <div className="item">
        x轴
        <InputStep id="postionX" num={position.x} disabled={true}></InputStep>
      </div>
      <div className="item">
        y轴
        <InputStep id="postionY" num={position.y} disabled={true}></InputStep>
      </div>
      <div className="item">
        z轴
        <InputStep id="postionZ" num={position.z} disabled={true}></InputStep>
      </div>
      <div className="title">相机旋转</div>
      <div className="item">
        x轴
        <InputStep id="rotateX" num={rotation.x} disabled={true}></InputStep>
      </div>
      <div className="item">
        y轴
        <InputStep id="rotateY" num={rotation.y} disabled={true}></InputStep>
      </div>
      <div className="item">
        z轴
        <InputStep id="rotateZ" num={rotation.z} disabled={true}></InputStep>
      </div>
    </div>
  );
}
